import { InputNumber, Input, Slider } from "antd";
import VColorPicker from "components/VColorPicker";
import ButtonSetting from "components/ButtonSetting";
export const customSorterConfigTemplate = `{
    sorter: (valueA, valueB) => {
        return valueA - valueB
    }
}`

export const componentExtraSetting: {[key: string]: any} = {
    VText: {
        
    },
    VNumber: {
        precision: {
            component: InputNumber,
            label: "精度",
            type: "basic",
            props: {
                min: 0,
                max: 10,
                precision: 0
            }
        }
    },
    VTag: {
        color: {
            component: VColorPicker,
            label: "颜色",
            type: "basic",
            props: {
                value: "#108ee9"
            }
        }
    },
    VTime: {
        format: {
            component: Input,
            label: "格式化时间",
            type: "basic",
            props: {
                placeholder: "请输入时间格式"
            },
            afterTransform: (ev: any) => ev?.target?.value,
        }
    },
    VImage: {
        width: {
            component: InputNumber,
            label: "图片宽度",
            type: "style",
            props: {
                max: 200,
                min: 0,
                precision: 0
            },
            afterTransform: (ev: any) => `${ev}px`,
            beforeTransform: (value: any) => value ? String(value).includes("px") ? Number(String(value).slice(0, -2)) : Number(value) : undefined 
        },
        height: {
            component: InputNumber,
            label: "图片高度",
            type: "style",
            props: {
                max: 200,
                min: 0,
                precision: 0
            },
            afterTransform: (ev: any) => `${ev}px`,
            beforeTransform: (value: any) => value ? String(value).includes("px") ? Number(String(value).slice(0, -2)) : Number(value) : undefined 
        },
        borderRadius: {
            component: Slider,
            label: "图片圆角",
            type: "style",
            props: {
                max: 200,
                min: 0
            },
            afterTransform: (ev: any) => `${ev}px`,
            beforeTransform: (value: any) => value ? String(value).includes("px") ? Number(String(value).slice(0, -2)) : Number(value) : undefined 
        }
    },
    VTagGroup: {
        color: {
            component: VColorPicker,
            label: "颜色",
            type: "basic",
            props: {
                value: "#108ee9"
            }
        }
    },
    VButtonGroup: {
        btns: {
            component: ButtonSetting,
            type: "basic",
            props: {
                btns: []
            }
        }
    }
}